import React, {PureComponent} from "react";
import {Icon, notification, Popconfirm, Table} from "antd";
import {connect} from "react-redux";
import {paginationProps, tableProps} from "../../lib/ui";
import {del, query} from "./actions";
import {containerOrderList} from "../home/actions";

class List extends PureComponent {

    onPageChange = (page, pageSize) => {
        const {dispatch} = this.props;
        dispatch(query({page, pageSize}));
    };

    handleDelete = id => {
        const {dispatch, page, pageSize} = this.props;
        dispatch(del(id)).then(() => {
                notification.success({
                    message: '删除成功'
                });
                dispatch(query({page, pageSize}));
            }
        );
    };

    componentWillMount() {
        const {dispatch} = this.props;
        dispatch(query({filter: {}}));
    }

    render() {
        const columns = [
            {
                title: "出境口岸",
                dataIndex: "name",
                width: "180px",
            }, {
                title: '功能',
                dataIndex: '',
                key: 'x',
                width: "80px",
                render: (text, record) => <span>
                    <Popconfirm title="确定删除此出境口岸?" okText="是" cancelText="否"
                                onConfirm={() => this.handleDelete(record.id)}>
                        <Icon type="delete"/>
                    </Popconfirm>
                </span>,
            }
            , {
                title: "",
                dataIndex: ""
            }
        ];
        const {
            page,
            pageSize,
            totalElements,
            dataSource,
            loading
        } = this.props;

        const tablePagination = {
            ...paginationProps,
            total: totalElements,
            current: page,
            pageSize: pageSize,
            onShowSizeChange: (current, newSize) =>
                this.onPageChange && this.onPageChange(1, newSize),
            onChange: this.onPageChange
        };
        return (
            <Table
                {...tableProps}
                columns={columns}
                pagination={tablePagination}
                dataSource={dataSource}
                loading={loading}
            />
        );
    }
}

const mapStateToProps = state => {
    return {
        ...state.coach.list
    };
};

export default connect(mapStateToProps)(List);
